<template>
	<view class="noticeBox" @click="toNoticeList" >
		<view class="promptImg">
			<image :src="`${baseUrl}/static/index/notice.png`" mode="widthFix" style="width: 42rpx;height: 48rpx;"></image>
		</view>
		<view class="noticeRight">
			<view class="notice-text u-line-1">{{notice}}</view>
			<view class="button-box">
				<u-icon name="arrow-right" size="24" color="#7fc877"></u-icon>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"my-notice",
		data() {
			return {
				baseUrl:this.$baseUrl,
			};
		},
		props:{
			notice:{
				type:String,
				default:"暂无公告"
			}
		},
		methods:{
			// 前往公告列表
			toNoticeList(){
				uni.navigateTo({
					url:"/pagesIndex/notice/detail"
				})
			},
		}
	}
</script>

<style lang="scss">
	.noticeBox{
		width: 100%;
		height: 64rpx;
		background-color: #f9fffa;
		border-radius: 16rpx;
		// border: #EBF3FF solid 1rpx;
		padding: 0rpx 12rpx;
		margin: 16rpx 0;
		display: flex;
		align-items: center;
		//  1.1喇叭图片
		.promptImg{
			font-size: 0;
			margin-right: 12rpx;
			flex-shrink: 0;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.noticeRight{
			width: calc(100% - 44rpx);
			height: 32rpx;
			line-height: 32rpx;
			font-weight: 400;
			font-size: 26rpx;
			color: #7fc877;
			display: flex;
			align-items: center;
			.notice-text{
				flex: 1;
			}
			.button-box{
				display: flex;
				align-items: center;
			}
		}
	}
</style>